{% load static %}
{% load i18n %}
{% load services %}
{% load cache %}
{% load sitetags %}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="{% static 'bootstrap-4.5.0/css/bootstrap.min.css' %}">
    {% block head %}{% endblock %}
    <title>{% block title %}{% endblock %}</title>
    <style>
        html{
            height: 100%;
            font-size: 14px;
        }
        body{
            display: flex;
            flex-direction: column;
            height: 100%;
        }
        .page-header{
            flex: 0 0 auto;
        }
        .page-content {
            flex: 1 0 auto;
            padding-top: 10px;
            padding-bottom: 20px;
        }
        .page-footer{
            background: #ececec;
            flex: 0 0 auto;
            {#height:60px;#}
        }
    </style>
</head>
<body>
<div class="page-header">
    <nav class="navbar navbar-expand-md navbar-dark bg-dark">
        {% get_website_title as site_title %}
        <a class="navbar-brand" href="{% url "home" %}">{{ site_title }}</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item"><a class="nav-link" href="{% url "home" %}"><i class="fa fa-home"></i>{% trans '首页' %}</a></li>
                {% block navbar %}{% endblock %}
            </ul>
            <ul class="navbar-nav">
                <li class="nav-item dropdown">
                   <a class="nav-link dropdown-toggle" href="#" id="navbar-help-dropdown" role="button" data-toggle="dropdown"
                           aria-haspopup="false" aria-expanded="false"><i class="fa fa-question-circle"></i></a>
                    <div class="dropdown-menu" aria-labelledby="navbar-help-dropdown">
                        <a class="dropdown-item" href="{% url 'apidocs' %}" target="view_window" >API交互文档</a>
                        <a class="dropdown-item" href="{% url 'redoc' %}" target="view_window" >API文档</a>
                        <a class="dropdown-item" href="{% url 'docs:docs' %}" target="view_window">文档</a>
                        <a class="dropdown-item" href="{% url 'about' %}">关于</a>
                    </div>
                </li>
                {% if user.is_authenticated %}
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbar-user-dropdown" role="button" data-toggle="dropdown"
                           aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-user"></i>{{ user.username }}
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbar-user-dropdown">
                            <a class="dropdown-item" href="{% url 'users:logout' %}?next=/">登出</a>
                            <a class="dropdown-item" href="{% url 'users:password' %}">修改密码</a>
                            <div class="dropdown-divider"></div>
                            {% if user.is_superuser %}
                                <a class="dropdown-item" href="{% url 'admin:index' %}">后台管理</a>
                            {% endif %}
                        </div>
                    </li>
                {% else %}
                    <li class="nav-item"><a class="nav-link" href="{% url 'users:login' %}">登录</a></li>
{#                    <li class="nav-item"><a class="nav-link" href="{% url 'users:register' %}">注册</a></li>#}
                {% endif %}
            </ul>
        </div>
    </nav>
</div>
    <div class="page-content">
        {% block body %}{% endblock %}
    </div>
    <footer class="page-footer text-center bg-dark text-white">
        <p class="p-2">Powered by <a target="_blank" href="https://gitee.com/cstcloud-cnic">CSTCloud-CNIC</a></p>
    </footer>
    <script type="text/javascript" src="{% static 'jquery/jquery-3.5.1.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'bootstrap-4.5.0/js/bootstrap.bundle.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'fontawesome-free/js/all.min.js' %}"></script>
    {% block base-script %}{% endblock %}
</body>
</html>